<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>XHR</title>
  <script type="importmap">
    {
      "imports": {
        "request": "../packages/xhr/index.js"
      }
    }
  </script>

  <script type="module">
    import { request } from "request"

    let controller;
    async function req() {
      controller = new AbortController();
      const res = await request({
        url: 'http://localhost:3000/test',
        responseType: 'json',
        signal: controller.signal,
      });

      console.log(res.response);
    }

    function abort() {
      controller?.abort()
    }

    window.req = req
    window.abort = abort
  </script>
</head>

<body>
  <button onclick="req()">request</button>
  <button onclick="abort()">Abort</button>
</body>

</html>
